/**
 *
 * Theme Name:        Dr. Jenko 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
 *
 */

/* :root{
    --main: #666666 ;
    --mainhover: #000000;
    --acc: #e40011 ;
    --acc-hover: #992564;
    --white: #ffffff;
    --lightgrey: #f6f6f6;
} */

body,html,*{font-size:16px;line-height:1.5;font-family:'Arial';font-weight:300;color: var(--main);}
.blog-2 body,html,*{font-size:16px;line-height:1.5;font-family:'Open Sans';font-weight:300;color: var(--main);}

html{scroll-behavior: smooth;overflow-x: hidden}

a{color:var(--main);text-decoration:underline;font-size:100%;transition:all .3s ease;font-weight: 600;}
p a{font-weight: 600;text-decoration: underline;}
a:hover{color:var(--mainhover);transition:all .3s ease;font-weight: 600;}
*:focus{outline: none!important;}
*:focus-visible{outline: auto;}
li{list-style:none;padding-left:30px;position:relative;padding-bottom: 5px;}
li:before{content:'';width:7.5px;height:7.5px;display:block;background:var(--main);position:absolute;top:6px;left:0;border-radius:50%;}
.blog-2 li:before{content:'';width:7.5px;height:7.5px;display:block;background:var(--acc);position:absolute;top:6px;left:0;border-radius:50%;}
.blog-2 .flx_textblock li{text-align: left;}
ul{padding:0;margin:0;}

img{max-width:100%;height:auto;}

h1{font-size:350%;display:block;width:max-content;position:relative;color:var(--main);margin:0;line-height:1.2;font-weight: 600;margin-bottom: 25px;width: 100%;}
h2{font-size:250%;display:block;width:max-content;position:relative;color:var(--main);margin:0;line-height:1.2;font-weight: 600;margin-bottom: 20px;width: 100%;}
h3{font-size:150%;display:block;width:max-content;position:relative;color:var(--main);margin:0;line-height:1.2;font-weight: 600;margin-bottom: 15px;width: 100%;}

.headline{font-weight:600;display:block;color:var(--main);margin-bottom:25px;line-height:1.2;}

.blog-2 h1,
.blog-2 h2,
.blog-2 h3,
.blog-2 .headline{text-align: center;position: relative;padding-bottom: 20px;font-family: 'Playfair Display';font-style: italic;}

.blog-2 h1::after,
.blog-2 h2::after,
.blog-2 h3::after,
.blog-2 .headline::after{display: inline-block;content: "";width: 200px;height: 3px;background: var(--acc);position: absolute;bottom: 0;left: calc(50% - 100px);}

.subline{font-size:150%;font-weight:300;display:block;color:var(--mainhover);margin-bottom:25px;text-align: center;}

.blog-1 .btn{position:relative;padding: 10px 50px;font-size:100%;font-weight:600;background:transparent;color:var(--main);transition:all .3s ease;line-height:1;text-align:center;text-decoration:none;border-radius:20px;border: 1px solid var(--main);margin: 1rem 0;}
.blog-1 .btn:hover{background:var(--main);color: var(--white);transition:all .3s ease;color:var(--white);border: 1px solid var(--main);margin-bottom: 1rem;}
.blog-2 .btn{position: relative;font-weight: 600;background: transparent;color: var(--main);transition: all .3s ease;line-height: 1;text-decoration: none;margin: 1rem 0;height: 100px;width: 100px;padding: 0 0 5px 0;align-items: center;display: flex;justify-content: center;margin: 0 auto;font-family: 'playfaire Display';font-size: 150%;font-style: italic;border-radius: 50%;border: 2px solid var(--acc);}
.blog-2 .btn:hover{background: var(--acc);color: var(--white);transition: all .3s ease;}

button{background-color: transparent;border: none;}
strong{font-weight:600;font-size:100%;}

.container{max-width:1400px;}
.container.wide{max-width:1850px;}

.highlight{font-weight: 600;font-size: 150%;color: var(--main);}

.blog-1 blockquote{position: relative;padding: 40px 0px 40px 60px;margin: 0;}
.blog-1 blockquote::before{content:'';position: absolute;background: url('media/quote.svg') no-repeat center;background-size: 100%;height: 50px;width: 50px;top: 33px;left: 0;}
.blog-1 blockquote p{padding-left: 15px;margin: 0;}
.blog-2 blockquote{position: relative;padding: 40px 0px 40px 0;margin: 0;}
.blog-2 blockquote p{padding-left: 15px;margin: 0;font-size: 260%;font-weight: 700;color: var(--acc);text-transform: uppercase;line-height: 1.2;}

iframe{border-radius: 10px;width: 100%;}


/*------------------------------------Header-------------------------------------------------*/

#page-header{position:absolute;top:0;right:0;left:0;padding:10px 0;background:var(--white);-webkit-box-shadow: 0px 10px 50px -35px rgba(0,0,0,0.5);-moz-box-shadow: 0px 10px 50px -35px rgba(0,0,0,0.5);box-shadow: 0px 10px 50px -35px rgba(0,0,0,0.5);z-index:9999;}

#menubuttonburger.active{background-size:30px!important;background:url('media/close.png') no-repeat;position:absolute;width:50px;height:50px;cursor:pointer;display:block;right:15px;top:5px;}
#menubuttonburger{background:url('media/menubutton.png') no-repeat;background-size:40px!important;position:absolute;width:50px;height:50px;cursor:pointer;right:20px;top:0;display:none;padding:8px 0;}

#page-header .logo img{max-width: 350px;}
.logo-sekundar img{max-width: 500px;float: right;}

#page-header .row{align-items: center;}

#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 .navigation{align-items: center;justify-content: end;}


#page-header #menuburgerbutton{display: none;float: right;right: 0;position: relative;height: 40px;width: 40px;}
#page-header #menuburgerbutton span{background-color: var(--acc);height: 4px;width: 40px;display: block;margin: 7px 0;border-radius: 10px;}
.blog-1 #page-header .menu-hauptmenu-container{display:none;position: absolute;background-color: #fff;padding: 30px;right: 0;top: 60px;box-shadow: 0 4px 8px #0002;}
.blog-2 #page-header .navigation .menu-hauptmenu-container{display:none;position: absolute;background-color: #fff;padding: 30px;right: 0;top: 60px;box-shadow: 0 4px 8px #0002;}



#page-header.bottom{padding:20px 0;position:fixed;top:0;left:0;right:0;background:var(--white);-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 .topheader{display:none;}
#page-header.bottom .logo img{max-width:300px;}
#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; }
}

.blog-2 .blogbutton{height: 100px;width: 100px;background-color: var(--acc);color: var(--white);font-family: 'Playfaire Display';font-style: italic;font-weight: 600;position: fixed;bottom: 30px;right: 30px;font-size: 210%;border-radius: 50%;padding-top: 24px;transition: all ease .3s;text-align: center;text-decoration: none;box-shadow: 0 4px 8px #0005;z-index: 9;}
.blog-2 .blogbutton:hover{background-color: var(--acc-hover);transition: all ease .3s;}



/*------------------------------------Headerbild (jeweils das Beitragsbild der Seite)-------------------------------------------------*/
.blog-1 .img.wp-post-image{width: 100%;margin-top: 75px;}

.blog-2 .img.wp-post-image{width: 100%;margin-top: 70px;margin-bottom: 3rem;height: 500px;object-fit: cover;position: relative;}
.blog-2 .headerbild{position: relative;}
.blog-2 .headerbild::after{position: absolute;content: '';background: url('media/LEBE-LIEBE-BADGE.png') no-repeat;height: 250px;width: 250px;top: calc(50% - 125px);left: calc(50% - 125px);background-size: 100%;display: block;}

/*------------------------------------Sidemenu-------------------------------------------------*/
.menu-hauptmenu-container li{padding: 0;}
.menu-hauptmenu-container li::before{display: none;}
.blog-1 .menu-hauptmenu-container a{padding: 5px 0 5px 30px;text-decoration: none;font-size: 150%;display: block;position: relative;}

.blog-1 .menu-hauptmenu-container{padding: 50px 0;}
.blog-1 .menu-hauptmenu-container .current_page_item a::before{content:'';position: absolute;background: url('media/favicon.ico') no-repeat center;background-size: 100%;height: 20px;width: 20px;top: 11px;left: 0;}
.blog-1 .sidemenu .menu-hauptmenu-container a::after{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--main);bottom: -3px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
.blog-1 .sidemenu .menu-hauptmenu-container a:hover::after{transform-origin: left;transform: scaleX(1);}


/*------------------------------------ Header bei lebe-liebe -------------------------------------------------*/

.blog-2 .menu-hauptmenu-container ul{display: flex;justify-content: end;}
.blog-2 .menu-hauptmenu-container li{padding: 10px 20px;}
.blog-2 .menu-hauptmenu-container a{padding: 0;text-decoration: none;font-size: 120%;display: block;position: relative;font-weight: 300;}
.blog-2 .menu-hauptmenu-container a::before{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--acc);bottom: -3px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
.blog-2 .menu-hauptmenu-container a:hover::before{transform-origin: left;transform: scaleX(1);}
.blog-2 .menu-hauptmenu-container li.current_page_item a::after{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--acc);bottom: -3px;left: 0;}

/*------------------------------------Footer-------------------------------------------------*/

#page-footer{background:var(--lightgrey);padding:75px 0 0;}

#page-footer .logo img{max-width: 400px;}

#page-footer .backtotop{position: relative;width: max-content;float: right;font-weight: 300;margin-top: 30px;}
#page-footer .kontaktblock{margin-top: 15px;}

#page-footer .kontakt li{list-style: none;padding: 0;line-height: 1.6;}
#page-footer .kontakt li::before{display: none;}
#page-footer .kontakt a{font-weight: 300;}

#page-footer .bottom{margin-top: 90px;}
#page-footer .copyright{display:block;width:100%;padding:15px 0;}
#page-footer .copyright span{display:inline-block;color:var(--main);font-size:100%;font-weight:300;text-decoration:none;transition:all .3s ease;}
#page-footer .copyright a{display:inline-block;color:var(--main);font-size:100%;font-weight:300;transition:all .3s ease;position: relative;}
#page-footer .copyright a:hover{color:var(--mainhover);}

#menu-footermenu{display: flex;justify-content: end;}
#menu-footermenu li{padding: 0 10px;}
#menu-footermenu li::before{display: none;}

.blog-2 #page-footer .footerjob{margin-bottom: 2rem;}


/*------------------------------ACF-Flexible-Content-----------------------------------------*/
/*------------------------------ACF-Flexible-Content-----------------------------------------*/
/*------------------------------ACF-Flexible-Content-----------------------------------------*/

.inhaltsbloecke{margin-top:50px;overflow:hidden;}
.blog-1 div[class^="flx_"], div[class*="flx_"]{padding:0 0 100px 0;}
.blog-2 div[class^="flx_"], div[class*="flx_"]{padding:0 0 65px 0;}
.blog-1 div[class^="flx_"]:last-of-type,
.blog-1 div[class*=" flx_"]:last-of-type{padding: 0 0 30px 0;}
.blog-2 div[class^="flx_"]:last-of-type,
.blog-2 div[class*=" flx_"]:last-of-type{padding: 0 0 100px 0;}

.blog-2 .inhaltsbloecke img{border-radius: 20px;}

/*Tabellenblock*/
.flx_tabellenblock .caption{display: ruby-text;}
.flx_tabellenblock .tabellen{margin-top: 50px;}
.flx_tabellenblock table{padding: 20px 0 50px;display: block;}
.flx_tabellenblock .tabellen tr{vertical-align: baseline;}
.flx_tabellenblock .tabellen td{padding-bottom: 10px;}
.flx_tabellenblock .tabellen td.datum{width: 20%;}
.blog-2 .flx_tabellenblock .tabellen td.datum{text-align: right;padding-right: 2rem;}
.flx_tabellenblock .tabellen td.inhalt{width: 80%;}
.flx_tabellenblock img{border-radius: 10px;}

/*Textblock*/
.blog-2 .flx_textblock.nurtext{width: 55%;margin: 0 auto;}

.blog-2 .flx_textblock .text{text-align: center;}
.blog-2 .flx_textblock.mitbildrechts .row,
.blog-2 .flx_textblock.mitbildlinks .row{align-items: center;}
.impressum.blog-2 .flx_textblock h2::after, 
.impressum.blog-2 .flx_textblock h3::after, 
.impressum.blog-2 .flx_textblock .headline::after{display: none;}
.datenschutzerklaerung.blog-2 .flx_textblock h2::after, 
.datenschutzerklaerung.blog-2 .flx_textblock h3::after, 
.datenschutzerklaerung.blog-2 .flx_textblock .headline::after{display: none;}


/*Interviewblock*/
.blog-2 .flx_interviewblock{margin-top: 5rem;}
.blog-2 .flx_interviewblock .interview{margin-bottom: 3rem;}
.blog-2 .flx_interviewblock .interview p{text-align: center;}
.blog-2 .flx_interviewblock h2{text-align: left;font-size: 160%;margin-bottom: 0;}
.blog-2 .flx_interviewblock h2::after{display: none;}

/*Interviewsteaser*/
.flx_interviewteaser .interview{margin: 1rem 0 2rem;}
.flx_interviewteaser h3.headline{text-align: left;font-size: 120%;height: 6rem;}

/*Blog*/
.flx_blog .headline{margin-bottom: 4rem;}
.flx_blog article{margin-bottom: 2rem;}


/*-----------------------------------SINGLE----------------------------------------------*/
#phpsingle h1, #phpsingle h2, #phpsingle h3, #phpsingle .headline{text-align: left;}
#phpsingle h1::after, #phpsingle h2::after, #phpsingle h3::after, #phpsingle .headline::after{display: none;}
#phpsingle .content{margin: 3rem 0;}
#phpsingle .widebtn{margin: 4rem 0;display: block;text-align: right;}


/*-----------------------------------RESPONSIVE----------------------------------------------*/
/*-----------------------------------RESPONSIVE----------------------------------------------*/
/*-----------------------------------RESPONSIVE----------------------------------------------*/
@media (max-width:1480px){

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:1199px){
    h1{font-size:300%;}
    h2{font-size:200%;}
    h3{font-size:120%;}
    
    .flx_interviewteaser h3.headline{height: 4rem;}

    .sidemenu .menu-hauptmenu-container a{font-size: 120%;font-weight: 300;}
    .sidemenu .menu-hauptmenu-container .current_page_item a::before{top: 8px;}
    .sidemenu .menu-hauptmenu-container a::before{content: '';position: absolute;width: 100%;height: 2px;border-radius: 5px;background-color: var(--main);bottom: -3px;left: 0;transform-origin: right;transform: scaleX(0);transition: transform .3s ease-in-out;}
    .sidemenu .menu-hauptmenu-container a:hover::before{transform-origin: left;transform: scaleX(1);}

    #page-footer .copyright{text-align: center;}
    #page-footer .menu-footermenu-container{text-align: center;display: flex;justify-content: center;margin-top: 10px;flex-wrap: wrap;}
    #page-footer .bottom{margin-top: 70px;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:991px) {
    .blog-1 #page-header .menu-hauptmenu-container{display: none;}
    .blog-1 #page-header .menu-hauptmenu-container.active{display:block;position: absolute;background-color: #fff;padding: 30px;right: 0;top: 50px;box-shadow: 0 4px 8px #0002;}
    .blog-1 #page-header .menu-hauptmenu-container li{margin-right: 0;margin-bottom: 15px;}
    .blog-1 #page-header .menu-hauptmenu-container li a{font-size: 150%;}
    .blog-1 #page-header .menu-hauptmenu-container li.menu-item-41 a{padding: 0;border: none;}
    .blog-1 #page-header .menu-hauptmenu-container li.menu-item-41 a:hover{background-color: unset;color: #DF6433;}
    .blog-1 #page-header .menu-hauptmenu-container li.current-menu-item::before{bottom: 15px;margin: unset;}
    
    .blog-2 .hautpmenunav{display: none;}
    /* .blog-2 .navigation .menu-hauptmenu-container.active{display: block;} */
    .blog-2 #page-header .navigation .menu-hauptmenu-container.active{display: block;top: 45px;}
    .blog-2 #page-header .navigation .menu-hauptmenu-container.active ul{flex-direction: column;}
    #page-header #menuburgerbutton{display: block!important;}
    #page-header #menuburgerbutton.active span{transition: all ease .3s;}
    #page-header #menuburgerbutton.active span:nth-child(1){-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;top: 8px;position: relative;}
    #page-header #menuburgerbutton.active span:nth-child(3){-webkit-transform: rotate(-45deg);-moz-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);-webkit-transition: .25s ease-in-out;-moz-transition: .25s ease-in-out;-o-transition: .25s ease-in-out;transition: .25s ease-in-out;top: -14px;left: -1px;position: relative;}
    #page-header #menuburgerbutton.active span:nth-child(2){opacity: 0;}


    .sidemenu,
    .logo-sekundar{display: none;}

    #page-footer .bottom{margin-top: 50px;}

}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:767px) {
    h1{font-size:250%;}
    h2{font-size:180%;}
    h3{font-size:115%;}

    .blog-2 blockquote p{font-size: 200%;padding-left: 0;}

    .blog-2 div[class^="flx_"]:last-of-type, .blog-2 div[class*=" flx_"]:last-of-type{padding: 0 0 50px 0;}

    .img.wp-post-image{margin-top: 60px;}

    .flx_tabellenblock .tabellen td.datum{width: 30%;}
    .flx_tabellenblock .tabellen td.inhalt{width: 70%;}
    
    .blog-2 .flx_textblock.nurtext{width: 100%;}

    
    .blog-2 *,.blog-2 h1, .blog-2 h2, .blog-2 h3, .blog-2 .headline,
    .blog-2 .subline,
    .blog-2 p{text-align: left!important;}
    .blog-2 h1::after, .blog-2 h2::after, .blog-2 h3::after, .blog-2 .headline::after{left: 0;}
    .blog-2 .btn{margin: 1rem 0;height: 70px;width: 70px;font-size: 120%;padding: 0 0 2px 0;font-size: 115%;}

    .blog-2 .blogbutton{right: 15px;bottom: 15px;height: 70px;width: 70px;font-size: 150%;padding-top: 18px;text-align: center!important;}

    #page-header .logo img,
    #page-footer .logo img,
    #page-header.bottom .logo img{max-width: 100%;width: 350px;}

    .blog-2 #page-header .logo img,
    .blog-2 #page-footer .logo img,
    .blog-2 #page-header.bottom .logo img{max-width: 100%;width: 190px;}

    .blog-2 .img.wp-post-image{height: 250px;}
    .blog-2 .headerbild::after{height: 150px;width: 150px;top: calc(50% - 75px);left: calc(50% - 75px);}
    .blog-2 .img.wp-post-image{margin-bottom: 1rem;}

    .blog-2 .flx_textblock .bild{margin-bottom: 2rem;}
    .blog-2 .flx_textblock .bild img{max-width: 350px;width: 100%;}
    .blog-2 .flx_textblock.mitbildrechts .row{flex-direction: column-reverse;}




}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:576px) {
    body,html,*{font-size:14px;}
    
    .flx_tabellenblock .tabellen td.datum{width: 40%;}
    .flx_tabellenblock .tabellen td.inhalt{width: 60%;}

    .flx_interviewteaser h3.headline{height: max-content;}

    #page-footer .bottom{margin-top: 30px;}


}
/*-------------------------------------------------------------------------------------------*/
@media (max-width:400px) {

}